<template>
  <div>
    <el-table :data="processData" border @cell-click="tableEdit">
      <el-table-column align="center" prop="firstLevelColumn" label="一级类目">
      </el-table-column>
      <el-table-column
        align="center"
        prop="selfOperatedSalesAmount"
        label="负库存数量"
      >
      </el-table-column>
      <el-table-column
        align="center"
        prop="selfOperatedReturnAmount"
        label="负库存商品占异常商品比"
      >
        <template slot-scope="scope">
          {{ scope.row.selfOperatedReturnAmount }}%
        </template>
      </el-table-column>
      <el-table-column align="center" prop="salesAmount" label="已销销售额">
      </el-table-column>
      <el-table-column
        align="center"
        prop="estimateSevenSaleNum"
        label="近7日预售销量"
      >
      </el-table-column>
      <el-table-column
        align="center"
        prop="estimateFifteenSaleNum"
        label="近15日预售销量"
      >
      </el-table-column>
      <el-table-column
        align="center"
        prop="presellProOfMinusInvRatio"
        label="预售商品占负库存比重"
      >
        <template slot-scope="scope">
          {{ scope.row.presellProOfMinusInvRatio }}%
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        prop="oversoldOfMinusInvRatio"
        label="超卖商品占负库存比重"
      >
        <template slot-scope="scope">
          {{ scope.row.oversoldOfMinusInvRatio }}%
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        prop="presellProOnTheWay"
        label="预售商品在途数"
      >
      </el-table-column>
      <el-table-column
        align="center"
        prop="oversoldOnTheWay"
        label="超卖商品在途数"
      >
      </el-table-column>
    </el-table>

    <el-table :data="ProCodeSaleList" border>
      <el-table-column
        align="center"
        prop="firstLevelColumn"
        label="归属一级类目"
      >
      </el-table-column>
      <el-table-column align="center" prop="spu" label="SPU款号">
      </el-table-column>
      <el-table-column align="center" prop="productName" label="商品名称">
      </el-table-column>
      <el-table-column align="center" prop="picUrl" label="商品图片">
      </el-table-column>
      <el-table-column
        align="center"
        prop="selfOperatedRefundRate"
        label="负库存数量"
      >
      </el-table-column>
      <el-table-column align="center" prop="salesAmount" label="已销销售额">
      </el-table-column>
      <el-table-column
        align="center"
        prop="estimateSevenSaleNum"
        label="近7日预售销量"
      >
      </el-table-column>
      <el-table-column
        align="center"
        prop="estimateFifteenSaleNum"
        label="近15日预售销量"
      >
      </el-table-column>
      <el-table-column align="center" prop="isPresell" label="是否预售">
      </el-table-column>
      <el-table-column align="center" prop="isOversold" label="是否超卖">
      </el-table-column>
      <el-table-column align="center" prop="quantityOnTheWay" label="在途数量">
      </el-table-column>
    </el-table>
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.thisPageSize"
      @pagination="getselectProCodeSaleList(pageReq)"
    />
  </div>
</template>
<script>
import {
  selectAbnormalProList,
  selectAbnormalProData,
  selectFirstLevelSaleList,
  selectProCodeSaleList,
} from "@/api/sale/BiSkuInfoDwd";
export default {
  props: {
    processData: {
      type: Array,
      default: () => [],
    },
    query: {
      type: Object,
      default: () => {},
    },
  },
  data() {
    return {
      ProCodeSaleList: [],
      total: 0,
      queryParams: {
        pageNum: 1,
        thisPageSize: 10,
      },
      pageReq: {},
    };
  },
  watch: {
    query: {
      handler: function (newnew, oldold) {
        this.getselectProCodeSaleList(this.processData[0]);
      },
      deep: true,
      immediate: true,
    },
  },
  methods: {
    tableEdit(row, column, cell, event) {
      this.queryParams.pageNum = 1;
      this.getselectProCodeSaleList(row);
    },
    getselectProCodeSaleList(row) {
      this.pageReq = {
        ...this.queryParams,
        ...this.query,
        firstLevelColumn: row.firstLevelColumn ? row.firstLevelColumn : null,
      };
      selectProCodeSaleList(this.pageReq).then((response) => {
        this.ProCodeSaleList = response.data ? response.data : [];
        this.total = response.totalCount ? response.totalCount : 0;
      });
    },
    tableRowClassName({ row, column, rowIndex, columnIndex }) {
      if (column.label.includes("自营")) {
        return "background:#ed7d31 !important;color:#fff ";
      } else if (column.label.includes("短视频")) {
        return "color: #515a6e;background:#c4dbf0 !important;";
      } else if (column.label.includes("直播")) {
        return "background:#ed7d31 !important;color:#fff ";
      } else if (column.label.includes("商品卡")) {
        return "color: #515a6e;background:#c4dbf0 !important;";
      } else if (column.label.includes("其他")) {
        return "background:#ed7d31 !important;color:#fff ";
      }
    },
  },
};
</script>

//一级类目
private String firstLevelColumn;
//异常总量
private Integer abnormalSkuQuantity;

//异常类型sku数
private Integer proTypeQuantity;

//缺货销售量
private Integer lossSalesQuantity;

//新品占缺货量比重
private Double newProOfLossRatio;

//近7日预售销量
private Integer estimateSevenSaleNum;

//近15日预售销量
private Integer estimateFifteenSaleNum;

//预售商品占负库存比重
private Double presellProOfMinusInvRatio;

//超卖商品占负库存比重
private Double oversoldOfMinusInvRatio;

//预售商品在途数
private Integer presellProOnTheWay;

//超卖商品在途数
private Integer oversoldOnTheWay;

//新品商品数
private Integer newProQuantity;

//预估销售额
private Double estimateSalesAmount;

//春夏季商品数
private Integer springSummerProQuantity;

//秋冬季商品数
private Integer fallAndWinterProQuantity;

//四季商品数
private Integer seasonAllProQuantity;

//已销毛利额
private Double grossProfit;

//已销销售额
private Double salesAmount;

//预估毛利额
private Double estimateGrossProfit;

//可售天数(库存)
private Double availableSaleDays;

//可售天数(库存+在途)
private Double totalAvailableSaleDays;



//一级类目
private String firstLevelColumn;

//spu
private String spu;

//商品名称
private String productName;

//商品图片
private String picUrl;

//是否预售
private String isPresell;

//是否超卖
private String isOversold;

//在途数量
private Integer quantityOnTheWay;

//缺货天数
private Integer lossProDays;

/** 库存金额 */
private Integer inventoryAmount;

//预估缺货量
private Integer estimateLossProQuantity;

//异常总量
private Integer abnormalSkuQuantity;

//异常类型sku数
private Integer proTypeQuantity;

//缺货销售量
private Integer lossSalesQuantity;

//近7日预售销量
private Integer estimateSevenSaleNum;

//近15日预售销量
private Integer estimateFifteenSaleNum;

//预估销售额
private Double estimateSalesAmount;

//已销毛利额
private Double grossProfit;

//已销销售额
private Double salesAmount;

//预估毛利额
private Double estimateGrossProfit;

//可售天数(库存)
private Double availableSaleDays;

//可售天数(库存+在途)
private Double totalAvailableSaleDays;

//库龄分布最大区间
private String maxInventoryAgeRange;





/** 7天销售量 */@Excel(name =“7天销售量")private Integer sevenSaleNum,
/** 15天销售量 */@Excel(name =“15天销售量")private Integer fifteenSaleNum;
/** 是否新品 */@Excel(name =“是否新品")private string isNewProduct;
/** 季节 */@Excel(name =“季节")private String productSeason;
/** 库存 */现有库存
@Excel(name =“库存")private Integer inventoryQuantity;




















































